<template>
    <view class="columnbox wdh-100 content" v-if="list">
        <view v-for="(item,index) in list" :key='index' class="columnbox one-info">
            <view class="rowbox one-box">
                <text>投诉类型：</text>
				<view >{{item.feedbackType}}</view>
                
            </view>
            <view class="rowbox one-box">
                <text>反馈内容：</text>
                {{item.feedbackContent}}
            </view>
            <view class="img-list wdh-100" v-if="item.urls">
                <image v-for="(item,index) in item.urls.split(',')" :key='index' :src="item" mode="aspectFill"></image>
            </view>
            <view class="rowbox one-box">
                <text>联系方式：</text>
                {{item.feedbackPhone}}
            </view>
            <view class="rowbox one-box line-box">
                <text>反馈时间：</text>
                {{item.createTime}}
            </view>
            <view class="rowbox one-box ">
                投诉结果
            </view>
            <template v-if="item.feedbackResult">
                <view class="rowbox one-box ">
                    {{item.feedbackResult}}
                </view>
                <view class="rowbox one-box">
                    <text> {{item.updateTime}}</text>
                </view>
            </template>
            <template v-else>
                <view class="rowbox one-box ">
                    管人员处理中，请耐心等待！
                </view>
            </template>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                pageNum: 1,
                total: 0,
                list: [],
				flag:false,
            };
        },
        onLoad() {
            this.getList()
        },
        onReachBottom() {
            if (this.list.length < this.total) {
                this.pageNum++
                this.getList()
            }
        },
        methods: {
            getList() {
                this.$req.get('/xcx/feedback/list', {
                    pageSize: 20,
                    pageNum: this.pageNum
                }).then(res => {
					console.log(res)
                    this.total = res.data.total
                    this.list = this.list.concat(res.data.rows)
					
                })
            }
        }
    }
</script>

<style lang="scss" scoped>
    .content {
        background: #f7f8fa;
        min-height: 100vh;
        justify-content: flex-start;
    }

    .one-info {
        margin: 10rpx 0;
        background: #fff;
        border-radius: 20rpx;
        padding: 20rpx 20rpx;
        width: 710rpx;
    }

    .one-box {
        width: 100%;
        justify-content: flex-start;
        font-size: 28rpx;
        margin-bottom: 20rpx;

        text {
            color: #9e9e9e;
        }
    }

    .img-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;

        image {
            width: 150rpx;
            height: 150rpx;
            margin-right: 20rpx;
            margin-bottom: 20rpx;
            border-radius: 10rpx;
        }
    }

    .line-box {
        padding-bottom: 20rpx;
        border-bottom: #f9f9f9 solid 1px;
    }

    .r-box {
        justify-content: flex-end;
        font-size: 28rpx;
        color: #d53536;
    }

    .one-btn {
        color: #323232;
        border: #e0e0e0 solid 1px;
        height: 50rpx;
        width: 100rpx;
        border-radius: 10rpx;
        margin-left: 40rpx;
    }
</style>